<template>
	<u-upload ref="uUpload" action="#" :auto-upload="false" max-count="1" :file-list="fileList" :max-size="1 * 1024 * 1024" :deletable="!disabled" :show-progress="isShowProgress" @on-list-change="onListChange" :size-type="['compressed']"></u-upload>
</template>

<script>
	import {
		getBase64
	} from "@/utils/getBase64.js"
	export default {
		props: {
			idPic: { //图片地址
				type: String,
			},
			disabled: { //是否禁用
				type: Boolean
			},
			show: { //显示图片地址
				type: String,
			}
		},
		data() {
			return {
				fileList: [],
				isShowProgress: false, //是否显示进度条
			}
		},
		watch: {
			idPic: {
				handler(newVal) {
					if (newVal) {
						this.$refs.uUpload.lists = [{
							url: newVal
						}]
					}
				},
				immediate: true
			},
		},
		methods: {
			async onListChange(lists) { //当内部文件列表被加入文件、移除文件，或手动调用clear方法时触发
				if (lists.length) {
					let res = await getBase64(lists[0].url) //base64转码
					this.$emit("update:idPic", res) //更新idPic
				} else {
					this.$emit("update:idPic", "") //更新idPic
				}
			},
		}
	}
</script>

<style>
</style>
